import {Component, OnDestroy, OnInit, ViewEncapsulation} from '@angular/core';
import {ImageServeService} from "@shared/service/image/image-serve.service";
import {Subject} from "rxjs/Subject";
import {ActivatedRoute, Router} from "@angular/router";
import {ToolsService} from "@shared/service/tools/tools.service";
import {SignUpService} from "@sign-up/sign-up.service";

declare var window;

@Component({
  selector: 'sign-up-create-club',
  templateUrl: './sign-up-create-club.component.html',
  styleUrls: ['./sign-up-create-club.component.scss'],
  encapsulation: ViewEncapsulation.None
})
export class SignUpCreateClubComponent implements OnInit, OnDestroy {
  public imgSrc = '';
  public photoUrl = '';
  public unchose = '';
  public chosed = '';
  public name = '';
  public agree = true;
  public upLoadSuccess = false;
  public ngUnSubscribe: Subject<void> = new Subject<void>();
  public params = {
    orderNumber: '',
    fileId: 0,
  };

  constructor(
    private imgSer: ImageServeService,
    private signUpSer: SignUpService,
    private route: ActivatedRoute,
    private toolsService: ToolsService,
    private router: Router
    ) {
    this.imgSrc = this.imgSer.getCreatClubImg();
    this.unchose = this.imgSer.getChoseStatus('unselect');
    this.chosed = this.imgSer.getChoseStatus('selected');
    this.route.queryParams.takeUntil(this.ngUnSubscribe).subscribe(params => {
      this.params.orderNumber = params['orderNumber'];
    });
  }

  selectImg(event) {

    const file = event.target.files[0];
    this.toolsService.showLoading();
    this.signUpSer.upLoadFile(file, '7', '2').subscribe((res) => {
      this.toolsService.hideLoading();
      if (res.result === '0') {
        this.upLoadSuccess = true;
        const reader = new FileReader();
        reader.onload = (r: any) => {
          this.imgSrc = r.target.result;
        };
        reader.readAsDataURL(file);
        this.photoUrl = res.data[0].fileName;
        this.params.fileId = res.data[0].fileId;
      } else {
        this.toolsService.showToast('图片上传失败，请重新尝试');
      }
    });
  }

  save() {
    const data = {
      groupName: this.name,
      groupLogo: this.params.fileId,
      orderNumber: this.params.orderNumber
    };
    this.toolsService.showLoading();
    this.signUpSer.groupCreateGroup(data).takeUntil(this.ngUnSubscribe)
      .subscribe(res => {
        this.toolsService.hideLoading();
        if (res.result === '0') {
          // if (res.data.free) {
          //   this.router.navigate(['/payment/result'], {queryParams: {mchOrderNumber: this.params.orderNumber}});
          // } else {
          //   this.router.navigate(['/payment'], {queryParams: {orderNumber: this.params.orderNumber}});
          // }
          this.signUpSer.goToPayOrResult(res.data.status, this.params.orderNumber);
        } else {
          this.toolsService.showToast(res.msg);
        }
      });
  }

  agreeChange() {
    this.agree = !this.agree;
  }

  gotoProtocol() {
    this.router.navigate(['/sign-up/protocol/organization']);
  }

  ngOnInit() {
  }

  ngOnDestroy() {
    this.ngUnSubscribe.next();
    this.ngUnSubscribe.complete();
  }
}
